$icon-font-path: "/bower_components/bootstrap-sass/fonts/";

@mixin font-face($font-family, $file-path, $weight: normal, $style: normal ) {
  @font-face {
    font-family: $font-family;
    font-weight: $weight;
    font-style: $style;

      src: url('#{$file-path}.eot');
      src: url('#{$file-path}.eot?#iefix')               format('embedded-opentype'),
           url('#{$file-path}.woff')                     format('woff'),
           url('#{$file-path}.ttf')                      format('truetype'),
           url('#{$file-path}.svg##{$font-family}')      format('svg');
    
  }
}

@include font-face(Lobster, '/fonts/Lobster');
@include font-face(Lato, '/fonts/Lato');
@import 'bootstrap-sass/lib/bootstrap';


.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* Space out content a bit */
body {
    padding-top: 100px;
    padding-bottom: 20px;
}

h1,h2,h3, label, hr {

  
    color: #fff
}
h2{font-size:2em;  font-family: Lobster;
    text-shadow: 1px 1px 0px #222222;}
h3{
    font-size: 3em;
      font-family: Lobster;
    text-shadow: 1px 1px 0px #222222;
}

.panel h2 {
    color:#000
}

@media (min-width: 1200px) and (min-height: 820px) {
#calendar-panel{
    position: fixed;
    top: 100px;
    width:768px;
}
}
@media (max-width: 1200px)  and (max-height: 820px){
#calendar-panel{
    position: static;
    top: 120px;
    width:auto;
}
}


/* Everything but the jumbotron gets side spacing for mobile first views */
.header,
.marketing,
.footer {
    padding-left: 15px;
    padding-right: 15px;
}

.fc-event-container a{
    text-decoration: none;
    color: #FFFFFF
}

/* Make the masthead heading the same height as the navigation */
.header h3 {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 40px;
    padding-bottom: 19px;
    color: #fff
}

/* Custom page footer */
.footer {
    padding-top: 19px;
    color: #777;
    border-top: 1px solid #e5e5e5;
}

.container-narrow > hr {
    margin: 30px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

/* Supporting marketing content */
.marketing {
    margin: 40px 0;
}

.marketing p + h4 {
    margin-top: 28px;
}


#headerwrap {
    
    padding-top: 60px;
}

#headerwrap h1 {
    text-align: center;
    margin-top: 30px;
    color: #FFF;
    font-size: 70px;
    
}

#headerwrap h3 {
    text-align: center;
    color: #FFF;
    font-size: 30px;
}

#headerwrap h5 {
    color: #FFF;
    font-weight: 700;
    text-align: left;
}

#headerwrap p {
    text-align: left;
    color: #FFF
}

#features {
    padding-top: 50px;
    padding-bottom: 50px;
}

#features .ac a{
    font-size: 20px;
}

#intro {
    text-align: center;
    padding-top: 50px;
    border-top: #bdc3c7 solid 5px;
    color: #FFF;
}


.nav-pills > li > a{
  background:#e6e6e6;
  border-radius: 15px;
}



.navbar{
  background-color: #2C343B;
  ul.nav{
    li{
      
      a{
        color:#fff;
      }
    }
  }
  
  a.navbar-brand{color:#C44741;font-family: Lobster;font-size:24px;text-shadow: 1px 1px 0px #222222;}
}

.brand {
    color:#C44741;
    font-family: Lobster;
    text-shadow: 1px 1px 0px #222222;
}

nav li:hover { box-shadow: 0 -5px 0 #f47321; }
nav a:hover {
  border-radius: 0 0 .25em .25em;
  background: #FFF;
  box-shadow: 0 5px 0 #000;
  color:white;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
  }



.recipe-card {
  position:relative;
  width:100%;
  background-color:#fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
  border-radius:4px;
  margin:0 auto;
  background:rgba(196, 71, 65,0.89);
}

.recipe-image {
  overflow:hidden;
  position:relative;
  clear:both;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.recipe-overlay {
  height:100%;
  background:transparent;
  background: linear-gradient(top, rgba( 0, 0, 0, 0 ) 0%, rgba( 0, 0, 0, 0.5 ) 100% );
  background: -moz-linear-gradient(top, rgba( 0, 0, 0, 0) 0%, rgba( 0, 0, 0, 0.5 ) 100% );
  background: -ms-linear-gradient(top, rgba( 0, 0, 0, 0 ) 0%, rgba( 0, 0, 0, 0.5 ) 100% );
  background: -o-linear-gradient( top, rgba( 0, 0, 0, 0 ) 0%, rgba( 0, 0, 0, 0.5 ) 100% );
  background: -webkit-linear-gradient( top, rgba( 0, 0, 0, 0 ) 0%, rgba( 0, 0, 0, 0.5 ) 100% );
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#550000FF, endColorstr=#550000FF);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ffffff, endColorstr=#ffffffff);
  margin:0;
  padding:0;
}

.recipe-title {
  left: 0;

}

.recipe-author {
  height:30px;
  padding:15px 20px 20px 20px;
}

.recipe-card-button {
  float:right;
  border-radius:4px;
  color:#fff;
  padding:5px 10px 5px 10px;
  font-weight:bold;
  background-color:#ff5b76;
}
.recipe-card-button:hover {
  color:#fff;
}


.recipe-card a, a:hover { text-decoration:none; color:#fff; }
.recipe-card li { 
    display:inline; 
    margin-right:10px;
    font-size:10.5pt;  
    font-family: 'Lato', sans-serif;
    color: #FFF;
    text-shadow: 1px 1px 0px #222222;
 }
.recipe-card ul{ margin:0 15px 0 15px; padding:0; }

.recipe-card h3 {
  font-family: 'Lato', sans-serif;
  font-weight:normal;
  font-size:15pt;
  padding: 10px 15px 10px 15px;
  margin:0;
  color: #FFF;
  text-shadow: 1px 1px 0px #222222;
}

.fc-event-title{
    font-family: Lato;
    text-shadow: 1px 1px 0px #222222;
}

.popover-title{
    background-color: #5E2B2B;
}

.popover-content{
  font-family: Lato;
  background-color: #2C343B;
}